<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui" 
      xmlns:f="http://java.sun.com/jsf/core">
    <ui:composition template="/resources/templates/template_site.xhtml">
        <ui:define name="slide">
            <h:form >
                <div align="center" >
                    <p:fieldset  legend="Photos des produits" toggleable="false" toggleSpeed="500">
                        <p:galleria value="#{galleriaBean.images}" var="image" effect="slide" effectSpeed="1000" panelHeight="200">  
                            <p:graphicImage value="#{photoStreamer.fileContent}">
                                <f:param name="photo_id" value="#{image}" />
                            </p:graphicImage>
                        </p:galleria>
                    </p:fieldset>
                </div>
            </h:form>
        </ui:define>
        <ui:define name="content" >
            <p:layout style="min-height: 100%; max-height: 100%" >  
                <p:layoutUnit position="center" style="min-height: 100%; max-height: 100%" > 
                    <p:dataGrid var="item" value="#{menuController.items}" columns="3"  
                                rows="6" paginator="true"  
                                paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  
                                emptyMessage="Cliquer sur une catégorie">  
                        <p:column >  
                            <p:panel header="#{item.nomitem}" style="text-align:center ; max-width: 280px ; min-width: 280px; min-height: 250px; max-height: 250px">  
                                <h:panelGrid columns="1" style="width:100%">
                                    <h:commandLink  title="View Detail" action="#{menuController.goDetails()}">  
                                        <p:graphicImage id="photo" value="#{photosItemBean.fileContent}" cache="FALSE" style="max-height: 100px; min-height: 100px">
                                            <f:param name="item_id" value="#{item.iditem}" />
                                        </p:graphicImage>
                                        <f:param name="item" value="#{item.iditem}" />
                                    </h:commandLink>
                                    <h:panelGrid columns="2" style="text-align: left; width: 100%" cellpadding="3px" >                                                    
                                        <h:outputText value="Description courte:" />
                                        <h:outputText value="#{item.desccourte}" />
                                        <h:outputText value="Prix:" />
                                        <h:outputText value="#{menuController.getPrix2(item)} DT" />
                                        <h:outputText value="Quantité disponible:" />
                                        <h:outputText value="#{item.quantiteitem}" />
                                    </h:panelGrid>

                                </h:panelGrid>  
                            </p:panel>  
                        </p:column>  
                    </p:dataGrid>  
                </p:layoutUnit>
            </p:layout>
        </ui:define>
    </ui:composition>
</html>
